import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import {AtTabs,AtTabsPane,AtInput,AtButton} from 'taro-ui'
import './tianjiahuanzhe.scss'
// import reactMixin from 'react-mixin';
// import myJs from './tianjiahuanzheJs.js'
import app from '../../../../main.js'

export default class Tianjiahuanzhe extends Component {
    config = {
        navigationBarTitleText: '添加患者'
    }
    constructor () { 
        super(...arguments); 
        this.state = {
            current:0,
            name:'',
            phone:'',
            doctor:{},
            qrcode: ''
        }
    }

    getData(){
        let data = {};
        let me = this;
        app.get('web/doctor/get', data, (res)=>{
            this.setState({
                doctor:res.data.result
            })
        })
    }

   changeCurrent(current){
        this.setState({
            current
        })
    }

    changeName(v){
        this.setState({
            name: v
        })
    }

    changePhone(v){
       this.setState({
          phone: v
       })
    }

    componentWillMount () {
        console.log('name',this.$router.params.name)
        console.log('phone',this.$router.params.phone)
        if(this.$router.params.name && this.$router.params.phone){
            this.setState({
                name:this.$router.params.name,
                phone:this.$router.params.phone
            })
        }
        this.getData();
        this.getQrcode();
    }

    getQrcode() {
        var me = this;
        app.get('web/doctor/getForPatientQrcodeByToken', {}, function(res) {
            me.setState({
                qrcode: res.data.result
            });
        });
    }

    send() {
        var me = this;
        app.post('web/sms/sendMessagesForPatient', {phone: this.state.phone, patient_name: this.state.name}, function(res) {
            if (res.data.status == 200) {
                app.success('发送成功');
                app.redirectTo('../suifangHuanzheLieBiao/suifangHuanzheLieBiao')
            } else {
                app.toast('发送失败');
            }
        });
    }
  
    render () {
        
        const { doctor } = this.state;

        return (
            <View className='tianjiahuanzhe'>
                <AtTabs 
                 current={this.state.current} 
                 onClick={this.changeCurrent.bind(this)} 
                 tabList={[{title:'手机号码添加'},{title:'二维码添加'}]}>
                    <AtTabsPane current={this.state.current} index={0}>
                        <View className=' class_0'>
                            <Text className=' class_1'>患者信息</Text>
                        </View>
                        <AtInput 
                         placeholder='请输入患者姓名' 
                         border={false} 
                         className=' class_2'
                         value={this.state.name}
                         onChange={this.changeName.bind(this)}
                         ></AtInput>
                        <AtInput 
                         placeholder='请输入手机号码' 
                         border={false}
                         value={this.state.phone}
                         onChange={this.changePhone.bind(this)}
                         ></AtInput>
                        <View className=' class_3'>
                            <Text className=' class_4'>短信发送模板</Text>
                        </View>
                        <View className=' class_5'>
                            <Text className=' class_6'>{this.state.name}您好，我是{doctor.name}医生，有任何关于你病情相关的问题想咨询我，请通过微信扫描链接 <Text className='t'>{app.apiUri}/stp/{doctor.id}</Text>中二维码来联系我。</Text>
                        </View>
                        <View className=' class_7'></View>
                        <AtButton className=' class_8' full onClick={this.send.bind(this)}>
                            <Text className=' class_9'>发送邀请</Text>
                        </AtButton>
                    </AtTabsPane>
                    <AtTabsPane current={this.state.current} index={1}>
                        <View className=' class_10'>
                            <View className=' class_11'>
                                <Text className=' class_12'>微信扫一扫关注{doctor.name}医生</Text>
                            </View>
                            <View className=' class_13'>
                                <Text className=' class_14'>随时随地都能问医生</Text>
                            </View>
                            <Image className=' class_15' src={app.getPath(this.state.qrcode)}/>
                            <View className=' class_16'>
                                <Text className=' class_17'>{doctor.name}</Text>
                            </View>
                            <View className=' class_18'>
                                <Text className=' class_19'>{doctor.positional_title} | 综合{doctor.department}</Text>
                            </View>
                            <View className=' class_20'>
                                <Text className=' class_21'>{doctor.hospital}</Text>
                            </View>
                        </View>
                        {/* <View className='at-row btn-box'>
                            <View className='at-col at-col-6'>
                                <AtButton type='primary' full={true} className='cancel-btn'>保存名片</AtButton> 
                            </View>
                            <View className='at-col at-col-6'>
                                <AtButton type='primary' full={true} className='update-btn'>分享名片</AtButton> 
                            </View>
                        </View> */}
                    </AtTabsPane>
                </AtTabs>
            </View>
        );
    }
}
//reactMixin.onClass(Tianjiahuanzhe,myJs);